var mycanvas_box = document.querySelector("#mycanvas"),
    mycanvas = mycanvas_box.getContext("2d");


var bg = new Image(),
    logo = new Image(),
    over = new Image(),
    bullet = new Image(),
    bullet_arr = new Array(),
    heros = new Array(),
    enemy1 = new Array(),
    enemy2 = new Array(),
    enemy3 = new Array(),
    enemy = new Array(),
    num = cut = 0,
    start = start2 = true,
    now_x = now_y = 0,
    new_draw_hero, new_draw_bullet, new_draw_enemy, time, time2, fen = fen2 = 0;

//加载图片
bg.src = "../img/bg.png";
logo.src = "../img/title.png";
bullet.src = "../img/bullet1.png";
over.src = "../img/resume.png";
for (var i = 0; i < 6; i++) {
    heros[i] = new Image();
    heros[i].src = `../img/hero${i + 1}.png`;

    enemy2[i] = new Image();
    enemy2[i].src = `../img/enemy2_${i + 1}.png`;
}
for (var i = 0; i < 5; i++) {
    enemy1[i] = new Image();
    enemy1[i].src = `../img/enemy1_${i + 1}.png`;
}
for (var i = 0; i < 9; i++) {
    enemy3[i] = new Image();
    enemy3[i].src = `../img/enemy3_${i + 1}.png`;
}


enemy3[enemy3.length - 1].onload = function () {
    goo();
}

function goo() {
    draw();
    if (!start) {
        start_game();
    }
    if (start2) {
        requestAnimationFrame(goo);
    }
}

//背景、logo(开始页面)
function draw() {
    mycanvas.clearRect(0, 0, mycanvas_box.width, mycanvas_box.height);
    mycanvas.save();

    mycanvas.translate(0, num++);
    mycanvas.drawImage(bg, 0, 0, mycanvas_box.width, mycanvas_box.height);
    mycanvas.drawImage(bg, 0, -mycanvas_box.height, mycanvas_box.width, mycanvas_box.height);
    mycanvas.restore();
    (num == 600) && (num = 0);

    if (start) {
        mycanvas.drawImage(logo, 50, 80, 300, 80);
        mycanvas.font = "20px sans-serif";
        mycanvas.fillText("鼠标移入开始游戏", 125, 400)
    }
}

//鼠标移入开始游戏
mycanvas_box.onmouseover = function () {
    start = false;
    //实例化子弹
    time = setInterval(() => {
        new_draw_bullet = new draw_bullet(bullet, new_draw_hero.x + 21, new_draw_hero.y - 20, 10, 20);
        bullet_arr.push(new_draw_bullet);
    }, 150);

    time2 = setInterval(() => {
        // 实例化敌机
        switch (Math.ceil(Math.random() * 3)) {
            case 1:
                new_draw_enemy = new draw_enemy(enemy1[0], Math.floor(Math.random() * 10) * 40, -30, 40, 30, 5);
                break;
            case 2:
                new_draw_enemy = new draw_enemy(enemy2[cut], Math.floor(Math.random() * 5) * 80, -120, 60, 80, 3);
                break;
            case 3:
                new_draw_enemy = new draw_enemy(enemy3[cut], Math.floor(Math.random() * 4) * 100, -150, 80, 120, 1);
                break;
        }
        enemy.push(new_draw_enemy);
        (enemy.length > 30) && (enemy.splice(enemy.length - 1, 1));
    }, 1000);

}
//取消发射子弹
mycanvas_box.onmouseout = function () {
    clearInterval(time);
    clearInterval(time2);
}

function start_game() {
    //实例化英雄机
    cut == 0 ? cut = 1 : cut = 0;
    new_draw_hero = new draw_hero(heros[cut], now_x - 25, now_y - 25, 50, 50);
    //英雄机飞动
    new_draw_hero._draw();
    new_draw_hero.move();
    //发射子弹
    bullet_arr.forEach(function (val, index) {
        val._draw();
        val.move(index);
    })
    //敌机飞动
    enemy.forEach(function (val, index) {
        val._draw();
        val.move(index);

        //碰撞
        if (crash(val, new_draw_hero)) {
            start2 = false;
            clearInterval(time2);
            clearInterval(time);
            mycanvas.clearRect(0, 0, mycanvas_box.width, mycanvas_box.height);
            mycanvas.drawImage(over, 0, 0, mycanvas_box.width, mycanvas_box.height);
            mycanvas.fillText(fen,200,220);
            mycanvas.fillText(fen,200,450);
        }
        // 每颗子弹和敌机碰撞销毁
        bullet_arr.forEach(function (val2, index2) {
            if (crash(val, val2)) {
                fen++;
                enemy.splice(index, 1);
                bullet_arr.splice(index2, 1);
            }
        })
    })
    //得分
    mycanvas.fillText("score:" + fen, 10, 20);
}

//敌机
function draw_enemy(imgs, x, y, w, h, speed) {
    this.imgs = imgs;
    this.x = x;
    this.y = y;
    this.w = w;
    this.h = h;

    this._draw = function () {
        mycanvas.drawImage(this.imgs, this.x, this.y, this.w, this.h)
    }
    this.move = function (index) {
        this.y += speed;
        (this.y > 700) && (enemy.splice(index, 1));

    }

}
//子弹
function draw_bullet(img, x, y, w, h) {
    this.img = img;
    this.x = x;
    this.y = y;
    this.w = w;
    this.h = h;

    this._draw = function () {
        mycanvas.drawImage(this.img, this.x, this.y, this.w, this.h);
    }
    this.move = function (index) {
        this.y -= 10;
        (this.y < -10) && (bullet_arr.splice(index, 1));
    }

}
//英雄机
function draw_hero(imgs, x, y, w, h) {
    this.imgs = imgs;
    this.x = x;
    this.y = y;
    this.w = w;
    this.h = h;

    this._draw = function () {
        mycanvas.drawImage(this.imgs, this.x, this.y, this.w, this.h);
    }
    this.move = function () {
        // 获取鼠标位置，飞机随着鼠标移动而移动
        mycanvas_box.onmousemove = function (e) {
            now_x = e.offsetX;
            now_y = e.offsetY;
        }
    }
}
//碰撞检测函数
function crash(objA, objB) {
    var objBl = objB.x;
    var objBt = objB.y;
    var objBr = objBl + objB.w;
    var objBb = objBt + objB.h;


    var objAt = objA.y + objA.h;
    var objAl = objA.x + objA.w;
    var objAr = objA.x;
    var objAb = objA.y;

    if (objAt > objBt && objAl > objBl && objBr > objAr && objAb < objBb) {
        return true
    }
    else {
        return false;
    }
}